import React from 'react'
import { message, notification,Card, Tooltip, Button, Table, Avatar } from 'antd'

import { history } from 'umi'
import { CheckOutlined } from '@ant-design/icons'
import './index.less'

export default class ReserveList extends React.Component {
    constructor() {
        super()
    }
    selfRender = text => <span style={{ display: 'block', textOverflow: 'ellipsis', overflow: 'hidden', wordBreak: 'keep-all', whiteSpace: 'nowrap' }}><Tooltip title={text}>{text}</Tooltip></span>

    componentDidUpdate(nextProps, nextContext) {
        console.log(nextProps)
    }
    see = (studentid, registerid) => {
        history.push({ pathname: '/reserve/editreserve', query: { studentid: encodeURI(studentid), registerid: encodeURI(registerid) } })
    }
    render() {
        const columns = [
            {
                title: '学生的姓名',
                dataIndex: 'username',
            },
            {
                title: '性别',
                dataIndex: 'sex',
            },
            {
                title: '状态',
                dataIndex: 'status',
                render: text => <span style={{ display: 'block', textOverflow: 'ellipsis', overflow: 'hidden', wordBreak: 'keep-all', whiteSpace: 'nowrap' }}><Tooltip title={text}>{text}</Tooltip></span>
            },
            {
                title: '创建时间',
                dataIndex: 'createdAt',
                render: text => this.selfRender(text)
            },
            {
                title: '操作',
                dataIndex: 'student_id',
                render: (text,item) => <Button onClick={() => { this.see(item.student_id,item.register_id) }} danger>为他看病</Button>
            }
        ]
        columns.forEach((item, index) => {
            console.log(item)
            console.log(index)
            columns[index]['align'] = 'center'

        })
        return (
            <div style={{padding:'5px 20px',width:'100%'}}>
                <Card title="挂号的列表"  style={{ width: '100%' }}>
                    <Table style={{ padding: '5px 20px' }} keyid='log_id' dataSource={this.props.reserveinfo} columns={columns} />
                </Card>

            </div>
        )
    }
}